<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
    p { outline-color: invert }
    p { outline: 3px solid invert }
</style>
<script>
    test(() => {
        assert_equals(document.styleSheets[0].cssRules.length, 2, "Syntax error in style rules.");
    }, "Check that both style rules were parsed.");

    test(() => {
        assert_equals(document.styleSheets[0].cssRules[0].style.length, 0, "Outline-color rule with invert was not dropped.");
    }, "Check that outline-color:invert is dropped.");

    test(() => {
        assert_equals(document.styleSheets[0].cssRules[1].style.length, 0, "Outline shorthand with invert was not dropped.");
    }, "Check that outline shorthand with invert is dropped.");
</script>
